<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>平台消息推送</title>
    <script src="js/lib/jquery-1.11.0.js"></script>
    <link rel="stylesheet" href="css/lib/bootstrap.min.css"/>
    <link rel="stylesheet" href="css/lib/loading.css" />
    <script src="js/lib/bootstrap.min.js"></script>
    <script src="js/lib/loading.js"></script>
    <script src="js/lib/vue.min.js"></script>
    <script src="js/lib/vue-resource.js"></script>
    <script src="js/base.js" type="text/javascript" charset="utf-8"></script>
</head>
<style>
    body{
        font-size:12px;
    }
    table,
    th,
    td {
        border: 1px solid #eee;
        border-collapse: collapse;
        padding: 5px;
        vertical-align: middle !important;
    }
    table td:nth-child(odd) {
        background-color: #f1f1f1;

    }
    table td:nth-child(even) {

    }
    table tr:nth-child(even) {
        background-color:#ffffff;
    }
</style>
<body>
<div class="">
    <!--加载动画-->
    <!--<div class="wrapper">
        <div id="loader-wrapper">
            <div id="loader"></div>
        </div>
    </div>-->
    <div style="padding:15px 5px 0px 5px;border:1px solid #ccc;margin-bottom:15px">
        <table class="table table-hover">
            <tbody>
            <tr>
                <th colspan="12">发送品牌消息推送：</th>
            </tr>
            <tr style="display:none">
                <td style="text-align:right">品牌:</td>
                <td colspan="12">
                    <!--<input  placeholder="请输入品牌ID"/>-->
                    <input type="text" id="msg1" class="form-control" style="width:280px;">
                </td>
            </tr>
            <tr>
                <td style="text-align:right">推送标题:</td>
                <td colspan="12">
                    <input type="text" id="msg2" class="form-control"/ value="重要通知:" style="width:280px;">
                </td>
            </tr>
             <tr>
                <td style="text-align:right">推送消息持续时间:</td>
                <td colspan="12">
                    <input type="text" id="msg4" class="form-control" style="width:280px;" value="2018-10-25 12:00:00"/>
                </td>
            </tr>
            <tr>
                <td style="text-align:right">推送内容:</td>
                <td colspan="12">
                    <textarea id="msg3" rows="10" cols="80" placeholder="在这填写你要发送的推送信息"></textarea>
                </td>
            </tr>
            <tr>
                <td colspan="12">
                    <input id="btn" type="btn" value="全平台发送" class="btn btn-danger" style="margin-left:200px"/>
                </td>
            </tr>
            </tbody>
        </table>
        <!-- 历史消息 -->
        <table class="table table-hover">
            <tbody  id="box">
            <tr>
                <th colspan="12">历史消息：</th>
            </tr>
            
            <tr colspan="12" style="font-size:16px;font-weight:600;">
                <td>
                    通知标题
                </td>
                <td>
                    通知内容
                </td>
                <td>
                    发送日期
                </td>
                <td>
                    操作
                </td>
            </tr>
            <tr v-for = "(li,index) in list">
                <td>
                    {{li.title}}
                </td>
                <td>
                    {{li.content}}
                </td>
                <td>
                    {{li.createTime}}
                </td>
                <td style="text-align:center;">
                    <a @click="del(li)" href="#">删除</a>
                </td>
            </tr> 
            </tbody>
        </table>
    </div>

</div>
</div>
</body>
<script>
    $(function(){
        /*获取全局数据*/
        var token = sessionStorage.getItem(1);
        console.log(token);
        var brand_id = sessionStorage.getItem(3);
        console.log(brand_id);
        $('#msg1').val(brand_id);
        var msg1 = $('#msg1').val();
        // console.log(msg1)
        /*获取所有通道列表*/
    	/*$.ajax({
    		        type:"GET",
                    url:window.baseUrl+"user/brand/query/all",
                    async:true,
                    dataType:"json",
                    data:{},
                    success:function(data){
                        console.log(data)
                        var html = "<option selected='selected' value=''>请选择贴牌</option>";
                        var vendorJson = eval(data.result);
                        for(var i=0; i<vendorJson.length; i++){
                        html += "<option value= '"+vendorJson[i].id+"'>"+vendorJson[i].name+"</option>";
                        }
                        $("#msg1").html('').append(html);
                    },
                    error:function(data){
                        alert('失败')
                    }
    	});*/
        $('#btn').click(function(){
            var msg1 = $('#msg1').val();
            var msg2 = $('#msg2').val();
            var msg3 = $('#msg3').val();
            var msg4 = $('#msg4').val();
            console.log(msg1);
            console.log(msg2);
            console.log(msg3);
            if(msg1==""|| msg2==""|| msg3==""){
                alert('请确认输入信息')
            }else{
                $.ajax({/*平台消息推送*/
					type:"POST",
                    url:window.baseUrl+"user/jpush/tset/brand",
                    async:true,
                    dataType:"json",
                    data:{
                        brand_id:msg1,
                        alert:msg2,
                        content:msg3,
                        end_time:msg4
                    },
                    success:function(data){
                        alert('成功')
                        console.log(data)
                    },
                    error:function(data){
                        alert('失败')
                    }
        		});
            }
        })

        /*vm实例*/
        var vm = new Vue({
        el: "#box",
        data: {
           list:[]
        },
        created: function(){
            _this = this
            $.ajax({
                    type:"GET",//查询通知
                    url:window.baseUrl+"user/jpush/history/brand/"+token,
                    async:true,
                    data:{
                        brand_id:brand_id                  
                    },
                    success:function(data){                       
                        _this.list = data.result.content;
                        console.log(_this.list);                      
                    },
                    error:function(data){
                        console.log(data)
                    }
            });
            // this.$http.get(window.baseUrl+"user/jpush/history/brand/"+token,{brand_id:2
            //             },{emulateJSON:true}).then(
            //                        function (res) { 
            //                              this.list = res.data.result.content;
            //                             console.log(res)
            //                        },function (res) { 
            //                         console.log(res.data.result.content)
            //                         alert("查询失败！")
            //                        } 
            //                       );     
        },
        methods:{
            //获取返利费率
            del: function (li) {
                console.log(li.id)
                var self = this;
                $.ajax({
                    url: window.baseUrl+"user/jpush/history/delete",
                    type: "POST",
                    data: {
                        id:li.id,
                    },
                    success: function (data) {
                        location.reload();
                    },
                    error: function () {
                        alert("获取信息失败！")
                    }
                })
            }
        }
    })
    });
</script>
</html>

